// AI工具数据
const aiTools = [
    {
        id: 1,
        name: "ChatGPT",
        icon: "💬",
        description: "OpenAI开发的强大对话AI，支持多种语言和复杂任务",
        category: "chat",
        tags: ["对话", "写作", "编程"],
        url: "https://chat.openai.com",
        featured: true
    },
    {
        id: 2,
        name: "Midjourney",
        icon: "🎨",
        description: "AI图像生成工具，能够根据文本描述创建高质量图像",
        category: "image",
        tags: ["图像生成", "艺术", "设计"],
        url: "https://www.midjourney.com",
        featured: true
    },
    {
        id: 3,
        name: "GitHub Copilot",
        icon: "💻",
        description: "AI编程助手，提供代码自动补全和建议",
        category: "coding",
        tags: ["编程", "开发", "代码"],
        url: "https://github.com/features/copilot",
        featured: true
    },
    {
        id: 4,
        name: "Notion AI",
        icon: "📝",
        description: "集成在Notion中的AI写作助手，帮助整理思路和内容创作",
        category: "writing",
        tags: ["写作", "笔记", "生产力"],
        url: "https://www.notion.so/product/ai",
        featured: false
    },
    {
        id: 5,
        name: "Runway",
        icon: "🎬",
        description: "AI视频编辑工具，支持视频生成和特效处理",
        category: "video",
        tags: ["视频编辑", "特效", "生成"],
        url: "https://runwayml.com",
        featured: false
    },
    {
        id: 6,
        name: "Descript",
        icon: "🎙️",
        description: "AI音频编辑工具，支持语音克隆和音频修复",
        category: "audio",
        tags: ["音频编辑", "语音", "播客"],
        url: "https://www.descript.com",
        featured: false
    },
    {
        id: 7,
        name: "Figma AI",
        icon: "🎯",
        description: "设计工具Figma的AI功能，辅助UI/UX设计",
        category: "design",
        tags: ["设计", "UI", "UX"],
        url: "https://www.figma.com/ai",
        featured: false
    },
    {
        id: 8,
        name: "Claude",
        icon: "🤖",
        description: "Anthropic开发的AI助手，专注于安全性和实用性",
        category: "chat",
        tags: ["对话", "分析", "安全"],
        url: "https://claude.ai",
        featured: true
    },
    {
        id: 9,
        name: "Stable Diffusion",
        icon: "🖼️",
        description: "开源的AI图像生成模型，支持本地部署",
        category: "image",
        tags: ["开源", "图像生成", "本地"],
        url: "https://stability.ai",
        featured: false
    },
    {
        id: 10,
        name: "Tabnine",
        icon: "⚡",
        description: "AI代码补全工具，支持多种编程语言",
        category: "coding",
        tags: ["代码补全", "开发", "多语言"],
        url: "https://www.tabnine.com",
        featured: false
    },
    {
        id: 11,
        name: "Grammarly",
        icon: "✍️",
        description: "AI写作助手，检查语法错误和改进写作风格",
        category: "writing",
        tags: ["语法检查", "写作", "英语"],
        url: "https://www.grammarly.com",
        featured: true
    },
    {
        id: 12,
        name: "DALL-E",
        icon: "🖌️",
        description: "OpenAI的图像生成AI，能够创建逼真的图像",
        category: "image",
        tags: ["图像生成", "逼真", "创意"],
        url: "https://openai.com/dall-e-3",
        featured: true
    },
    {
        id: 13,
        name: "Jasper",
        icon: "📊",
        description: "AI内容创作平台，适合营销和商业写作",
        category: "writing",
        tags: ["营销", "商业", "内容"],
        url: "https://www.jasper.ai",
        featured: false
    },
    {
        id: 14,
        name: "Replit Ghostwriter",
        icon: "👻",
        description: "在线IDE的AI编程助手，实时代码建议",
        category: "coding",
        tags: ["在线", "编程", "实时"],
        url: "https://replit.com/site/ghostwriter",
        featured: false
    },
    {
        id: 15,
        name: "Adobe Firefly",
        icon: "🔥",
        description: "Adobe的创意AI工具集，集成在Creative Cloud中",
        category: "design",
        tags: ["创意", "Adobe", "设计"],
        url: "https://www.adobe.com/sensei/generative-ai/firefly.html",
        featured: true
    }
];

// 当前状态
let currentCategory = 'all';
let currentSearch = '';

// DOM加载完成后初始化
document.addEventListener('DOMContentLoaded', function() {
    initializeApp();
});

// 初始化应用
function initializeApp() {
    setupCategoryTabs();
    setupSearch();
    renderTools();
    setupFooterLinks();
}

// 设置分类标签
function setupCategoryTabs() {
    const tabs = document.querySelectorAll('.category-tab');
    
    tabs.forEach(tab => {
        tab.addEventListener('click', function() {
            // 移除所有active类
            tabs.forEach(t => t.classList.remove('active'));
            
            // 添加active类到当前标签
            this.classList.add('active');
            
            // 更新当前分类
            currentCategory = this.getAttribute('data-category');
            
            // 重新渲染工具
            renderTools();
        });
    });
}

// 设置搜索功能
function setupSearch() {
    const searchInput = document.getElementById('searchInput');
    
    searchInput.addEventListener('input', function() {
        currentSearch = this.value.toLowerCase().trim();
        renderTools();
    });
    
    // 支持回车键搜索
    searchInput.addEventListener('keypress', function(e) {
        if (e.key === 'Enter') {
            searchTools();
        }
    });
}

// 搜索工具
function searchTools() {
    const searchInput = document.getElementById('searchInput');
    currentSearch = searchInput.value.toLowerCase().trim();
    renderTools();
}

// 渲染工具卡片
function renderTools() {
    const container = document.getElementById('toolsContainer');
    
    // 过滤工具
    const filteredTools = aiTools.filter(tool => {
        const matchesCategory = currentCategory === 'all' || tool.category === currentCategory;
        const matchesSearch = !currentSearch || 
            tool.name.toLowerCase().includes(currentSearch) ||
            tool.description.toLowerCase().includes(currentSearch) ||
            tool.tags.some(tag => tag.toLowerCase().includes(currentSearch));
        
        return matchesCategory && matchesSearch;
    });
    
    // 清空容器
    container.innerHTML = '';
    
    // 显示空状态
    if (filteredTools.length === 0) {
        container.innerHTML = `
            <div class="empty-state">
                <h3>没有找到匹配的工具</h3>
                <p>尝试调整搜索关键词或选择其他分类</p>
            </div>
        `;
        return;
    };
    
    // 渲染工具卡片
    filteredTools.forEach(tool => {
        const toolCard = createToolCard(tool);
        container.appendChild(toolCard);
    });
}

// 创建工具卡片
function createToolCard(tool) {
    const card = document.createElement('div');
    card.className = 'tool-card';
    
    // 构建标签HTML
    const tagsHtml = tool.tags.map(tag => `<span class="tool-tag">${tag}</span>`).join('');
    
    card.innerHTML = `
        <div class="tool-icon">${tool.icon}</div>
        <h3>${tool.name}</h3>
        <p class="tool-description">${tool.description}</p>
        <div class="tool-tags">${tagsHtml}</div>
        <a href="${tool.url}" target="_blank" class="tool-link">访问网站</a>
    `;
    
    return card;
}

// 设置页脚链接
function setupFooterLinks() {
    const footerLinks = document.querySelectorAll('.footer-section a[data-category]');
    
    footerLinks.forEach(link => {
        link.addEventListener('click', function(e) {
            e.preventDefault();
            const category = this.getAttribute('data-category');
            
            // 更新分类标签
            const tabs = document.querySelectorAll('.category-tab');
            tabs.forEach(tab => tab.classList.remove('active'));
            
            const targetTab = document.querySelector(`[data-category="${category}"]`);
            if (targetTab) {
                targetTab.classList.add('active');
                currentCategory = category;
                renderTools();
                
                // 滚动到工具区域
                document.querySelector('.tools-grid').scrollIntoView({ 
                    behavior: 'smooth' 
                });
            }
        });
    });
}

// 工具统计
function getToolStats() {
    const totalTools = aiTools.length;
    const categories = [...new Set(aiTools.map(tool => tool.category))];
    const featuredTools = aiTools.filter(tool => tool.featured).length;
    
    return {
        totalTools,
        categories: categories.length,
        featuredTools
    };
}

// 更新统计数据（如果需要动态更新）
function updateStats() {
    const stats = getToolStats();
    // 可以在这里更新页面上的统计数据
}

// 导出功能（如果需要）
window.searchTools = searchTools;